<!-- 入库 -->
<template>
	<el-drawer v-model="isShowDrawer" direction="rtl" :before-close="handleClose" :size="curDrawerSize" :close-on-click-modal="isReadOnly">
		<template #header="{ titleId, titleClass }">
			<div class="zs-drawer-header" :id="titleId" :class="titleClass">
				<i class="icon-b-item zs-icon zs-text-blue zs-space-right-sm"></i>
				<div class="zs-title zs-text-black">入库</div>
			</div>
		</template>

		<template #default>
			<el-container class="zs-drawer-container">
				<el-scrollbar class="zs-drawer-content">
					<!-- card1 -->
					<div class="zs-align-center zs-space-bottom" id="sm-drawer-demo-card-01">
						<i class="icon-s-item zs-icon zs-text-blue zs-space-right-sm"></i>
						<div class="zs-title">预算清单</div>
					</div>
					<div class="zs-card zs-space-bottom">
						<HsForm :filed-list="storageInBillFiledList" ref="billForm" :isDisabled="isReadOnly"></HsForm>
					</div>
					<!-- card2 -->
					<div class="zs-align-center zs-space-bottom zs-space-top-lg" id="sm-drawer-demo-card-02">
						<i class="icon-s-item zs-icon zs-text-blue zs-space-right-sm"></i>
						<div class="zs-title">物料信息</div>
					</div>
					<div class="zs-card zs-space-bottom">
						<HsForm :filed-list="storageInSuppliesFiledList" ref="suppliesForm" :isDisabled="isReadOnly"></HsForm>
					</div>
					<!-- card3 -->
					<div class="zs-align-center zs-space-bottom zs-space-top-lg" id="sm-drawer-demo-card-03">
						<i class="icon-s-item zs-icon zs-text-blue zs-space-right-sm"></i>
						<div class="zs-title">入库信息</div>
					</div>
					<div class="zs-card zs-space-bottom">
						<HsForm :filed-list="storageInInfoFiledList" ref="storageInForm" @remoteMethod="remoteMethod" :isDisabled="isReadOnly"></HsForm>
					</div>
				</el-scrollbar>
				<hsDocWrapper :nodeList="curNodeList" />
			</el-container>
		</template>

		<template v-if="handleType != 'info'" #footer>
			<div>
				<el-button class="zs-btn-md zs-btn-primary" @click="doConfirm">提交</el-button>
			</div>
		</template>
	</el-drawer>
</template>

<script setup>
	import HsForm from '@/components/hsForm.vue';
	import { storageInBillFiledList, storageInSuppliesFiledList, storageInInfoFiledList } from '@/config/form/supplies.js';
	import { userSearchApi, getStoreSelfUseListApi } from '@/api/common.js';
	import { storageInApi } from '@/api/supplies.js';
	import { ElMessage } from 'element-plus';
	import { ref, reactive, watch, nextTick, watchEffect } from 'vue';
	import { useStore } from 'vuex';
	import { useRoute } from 'vue-router';
	import { setFormSelectOptions } from '@/utils/formEvent';
	import { deepClone } from '@/utils/publicUtils';
	const props = defineProps({
		isShow: { type: Boolean, default: false },
		isReadOnly: { type: Boolean, default: true },
		handleType: { type: String, default: '' },
		currentRow: { type: Object },
	});
	const route = useRoute();
	const store = useStore();
	const dictObj = store.getters.getDictObj(['PROPERTY_MATERIEL_TYPE']);
	const curDrawerSize = ref(store.state.uiDrawerSize);
	const emit = defineEmits(['close']);
	let isShowDrawer = ref(props.isShow);
	const curNodeList = ref([
		{ name: '预算清单', id: 'sm-drawer-demo-card-01' },
		{ name: '物料信息', id: 'sm-drawer-demo-card-02' },
		{ name: '入库信息', id: 'sm-drawer-demo-card-03' },
	]);
	const billForm = ref();
	const suppliesForm = ref();
	const storageInForm = ref();

	watch(
		() => props.isShow,
		(newVal, oldVal) => {
			isShowDrawer.value = newVal;
			nextTick(() => {
				newVal && props.handleType == 'add' && initForm();
			});
		},
	);

	//提交
	const doConfirm = async () => {
		let modleSupplies = await suppliesForm.value.validateForm();
		let modleStorageIn = await storageInForm.value.validateForm();
		if (!modleSupplies || !modleStorageIn) return;
		let params = Object.assign(modleSupplies, modleStorageIn);
		params.materielId = props.currentRow.id;
		params.attachmentUrlList.forEach(item => {
			item.attachmentName = item.attachmentName || item.originalName;
			item.attachmentUrl = item.attachmentUrl || item.relativePath;
		});
		let res = await storageInApi(params);
		if (res.data.code == 200) {
			ElMessage({
				message: '提交成功',
				type: 'success',
			});
			isShowDrawer.value = false;
			emit('close', { isShow: false, isRefresh: true });
		}
	};

	//关闭抽屉
	const handleClose = done => {
		emit('close', { isShow: false });
		done();
	};

	//表单初始化
	const initForm = () => {
		let nowDate = new Date().getTime();
		billForm.value.setFiledVal({ level1Value: props.currentRow.level1Value, level2Value: props.currentRow.level2Value, level3Value: props.currentRow.level3Value, inventoryName: props.currentRow.inventoryName });
		suppliesForm.value.resetFields();
		suppliesForm.value.setFiledVal({ attachmentUrlList: [] });
		storageInForm.value.resetFields();
		storageInForm.value.setFiledVal({ warehousingTime: nowDate });
	};

	//表单关联
	const selectChange = data => {};

	//联想查询
	const remoteMethod = data => {
		if (data.filedName == 'warehousingPersonnel') {
			getSearchList(data.remoteVal);
		}
	};

	//用户列表
	const getSearchList = async name => {
		if (!name) return;
		const phoneNumberPattern = /^1[3-9]\d{9}$/;
		let nameParams = phoneNumberPattern.test(name) ? { phoneNumber: name } : { realName: name };
		let params = Object.assign({ pageSize: 10000, pageNum: 1 }, nameParams);
		let res = await userSearchApi(params);
		res.data.data.userList.forEach(item => {
			item.name = `${item.realName}(${item.phoneNum})`;
		});
		setFormSelectOptions(storageInInfoFiledList, 'warehousingPersonnel', res.data.data.userList);
	};

	//存放位置
	const getStoreSelfUseList = async name => {
		let res = await getStoreSelfUseListApi({ projectCode: route.query.projectCode });
		res.data.data.forEach(item => {
			item.name = `${item.storeLocation}(${item.unitStoreNum})`;
		});
		setFormSelectOptions(storageInSuppliesFiledList, 'locationId', res.data.data);
	};

	setFormSelectOptions(storageInSuppliesFiledList, 'materielType', dictObj.PROPERTY_MATERIEL_TYPE);
	getStoreSelfUseList();
</script>
